<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" href="css/mui.css" />
		<link rel="stylesheet" href="fonts/iconfont.css" />
		<link rel="stylesheet" href="css/style.css" />
	</head>

	<body class="bg">
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">支付</h1>
		</header>
		<div class="mui-content">
			<div class="membercard">
				<div class="card">
					<ul class="mui-table-view">
						<li class="mui-table-view-cell">
							<a href="javascript:void(0)">
								<label>金额</label>
								<span class="money">0.00</span>
							</a>
						</li>
					</ul>
				</div>
				<div class="select-money">
					<div class="title">选择支付方式</div>
					<div class="pay-type">
						<ul class="mui-table-view">
							<li class="mui-table-view-cell mui-radio mui-right">
								<dl class="mui-clearfix">
									<dt><img src="images/pay4.png"/></dt>
									<dd>
										<h4>微信支付</h4>
										<p>微信支付，快人一步</p>
									</dd>
								</dl>
								<input name="radio" checked="checked" type="radio">
							</li>

						</ul>
					</div>
					<div class="pay-button"><button type="button" id="pay">确认支付</button></div>
				</div>
			</div>
		</div>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
		<script type="text/javascript" src="js/common.js"></script>
		<script type="text/javascript" src="js/mui.min.js"></script>
		<script type="text/javascript" charset="utf-8">
			mui.init();
			var orderId, type;
			mui.plusReady(function() {
				var _self = plus.webview.currentWebview();
				orderId = _self.orderid;
				type = _self.type;
				$(".money").html(_self.money);
			})
			var wxChannel;
			var channel = null;
			// 1. 获取支付通道
			function plusReady1() {
				// 获取支付通道
				plus.payment.getChannels(function(channels) {
					for(var i=0;i<channels.length;i++){
						if(channels[i].id=='wxpay'){
							wxChannel = channels[i];
						}
					}
				}, function(e) {
					mui.toast("获取支付通道失败：" + e.message);
				});
			}
			
			document.addEventListener('plusready', plusReady1, false);

			document.getElementById('pay').addEventListener('tap', function() {
				pay();
			})
			
			//防止重复提交
			var flag = true;
			// 2. 发起支付请求
			function pay() { 
				
				if(!flag)
				{
					return "";
				}
				// 从服务器请求支付订单
				var PAYSERVER = '';
 				channel = wxChannel;	
 				flag = false;
				mui.ajax('http://amierzhandui.com/amier/pay/wxpay', {
					data: {
						id: orderId,
						type: type,
						token: token
					}, 
					dataType: 'json', //服务器返回json格式数据
					type: 'post', //HTTP请求类型
					timeout: 10000, //超时时间设置为10秒；
					headers:{'Content-Type':'application/json'}, 
					success: function(data){ 
						flag = true;
						plus.payment.request(channel, data, function(result) {
							plus.nativeUI.alert("支付成功！", function() {
								mui.toast('支付成功！');
								if(type==1){
									mui.openWindow({
										'url': 'sign-peo-success.html',
										'id': 'sign-peo-success.html',
										createNew: true,
										extras:{
											orderId:orderId
										}
									});
								}else{
									mui.openWindow({
										'url': 'sign-team-success.html',
										'id': 'sign-team-success.html',
										createNew: true
									});
								}
								setTimeout(function() {
									mui.currentWebview.close('none');
								}, 300);
							});
						}, function(error) {
//							plus.nativeUI.alert("支付失败：" + JSON.stringify(error));
							mui.toast("支付失败")
						});
					},
					error: function(xhr, type, errorThrown) {
						//异常处理；
						mui.toast(type);
					}
				});
			}
		</script>
	</body>

</html>